<template>
  <div>
    <el-form ref="form" label-width="120px" style="padding: 10px 8px;">
          <el-form-item>
            <div class="establish">
              <el-button type="primary" size="small" @click="selected">刷新</el-button>
              <el-button type="danger" size="small" @click="clearData">一键清除数据</el-button>
            </div>
          </el-form-item>
    </el-form>

    <el-table
      :data="dicList"
      border
      height="400"
      :header-row-style="{
        'background-color': '#E6E6E6',
        'font-weight': 'bold',
        color: '#333'
      }"
      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
      align="center"
      style="width: 100%; margin-bottom: 20px"
      row-key="id"
    >
      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="name"
        label="名称"
      />

      <el-table-column
        show-overflow-tooltip
        align="center"
        prop="code"
        label="值"
      />

      <el-table-column fixed="right" align="center" label="操作">
        <template slot-scope="scope">
          <el-button type="text" size="mini" @click="() => upload(scope.row)"
          >修改
          </el-button>
        </template>
      </el-table-column>
    </el-table>

    <el-dialog
      :visible.sync="dialogFormVisible"
      :title="dialogFormValue"
    >
      <el-form
        ref="dic"
        :model="dic"
        label-width="300px"
      >
        <el-form-item :label="dic.name" prop="code">
          <el-col :span="20">
            <el-input-number v-model="dic.code" controls-position="right" :min="1"></el-input-number>
          </el-col>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="restData()">取 消</el-button>
        <el-button type="primary" @click="update('role')">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import user from "@/api/acl/user.js";

export default {
  data() {
    return {
      keyList: [],
      dialog: false,
      dataList: [],
      isUpdate: false,
      dialogFormVisible: false,
      dicList: [],
      roleIdUpdate: "",
      dic: {
        id: null,
        name: "",
        code: ""
      },
      type: 3,
      roleQuery: {
        roleName: "",
        page: 1,
        limit: 10
      }
    };
  },
  mounted() {
    this.getDicList();
  },
  methods: {
    update() {
      let aa = [73,74,75]
      let flg = -1
      aa.forEach(item =>{
        if (this.dic.id === item){
          flg = 1
        }
      })
      if (flg ===1){
        // 需要消息提醒
        this.$confirm("确定要修改消息配置吗?，修改后可能会导致用户收不到消息", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            user.saveListDict(this.dic)
              .then(response => {
                this.dialogFormVisible = false;
                this.$message({
                  message: "修改成功",
                  duration: 1000
                });
                this.getDicList()
              });
          })
      }else {
        // 不需要消息提醒
        user.saveListDict(this.dic)
          .then(response => {
            this.dialogFormVisible = false;
            this.$message({
              message: "修改成功",
              duration: 1000
            });
            this.getDicList()
          });
      }


    },
    restData() {
      this.dialogFormVisible = false;
      this.dialogFormValue = "";
    },
    selected() {
      this.roleQuery.page = 1;
      this.getDicList();
    },
    getDicList() {
      user.getMessageConfig().then(response => {
        this.dicList = response;
      });
    },
    upload(val) {
      this.isUpdate = true;
      this.dialogFormVisible = true;
      this.dialogFormValue = "修改系统设置";
      this.dic = {
        id: val.id,
        name: val.name,
        code: val.code
      };
    },
    clearData() {
      this.$confirm("是否清除全部数据?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          user.clearData().then(res => {
            if (res.rtn === 0) {
              this.$message({
                message: "删除成功",
                duration: 1000
              });
              this.roleListClick();
            } else {
              this.$message({
                message: res.message,
                duration: 1000
              });
            }
          })
        })
    }
  }
};
</script>
<style scoped>
.establish {
  padding-right: 20px;
  text-align: right;
}
</style>
